<!DOCTYPE html>
<html class="no-js" lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="shortcut icon" th:href="@{/assets/images/index/favicon.ico}" type="image/x-icon">
    <link rel="stylesheet" href="../css/cart_style.css" th:href="@{/assets/css/cart_style.css}">
    <title>评论</title>
    <style type="text/css">
        .smart-green {
            margin-left:auto;
            margin-right:auto;
            max-width: 500px;
            background: #F8F8F8;
            padding: 30px 30px 20px 30px;
            font: 12px Arial, Helvetica, sans-serif;
            color: #666;
            border-radius: 5px;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
        }
        .smart-green h1 {
            font: 24px "Trebuchet MS", Arial, Helvetica, sans-serif;
            padding: 20px 0px 20px 40px;
            display: block;
            margin: -30px -30px 10px -30px;
            color: #FFF;
            background: #9DC45F;
            text-shadow: 1px 1px 1px #949494;
            border-radius: 5px 5px 0px 0px;
            -webkit-border-radius: 5px 5px 0px 0px;
            -moz-border-radius: 5px 5px 0px 0px;
            border-bottom:1px solid #89AF4C;

        }
        .smart-green h1>span {
            display: block;
            font-size: 11px;
            color: #FFF;
        }

        .smart-green label {
            display: block;
            margin: 0px 0px 5px;
        }
        .smart-green label>span {
            float: left;
            margin-top: 10px;
            color: #5E5E5E;
        }
        .smart-green input[type="text"], .smart-green input[type="email"], .smart-green textarea, .smart-green select {
            color: #555;
            height: 30px;
            line-height:15px;
            width: 100%;
            padding: 0px 0px 0px 10px;
            margin-top: 2px;
            border: 1px solid #E5E5E5;
            background: #FBFBFB;
            outline: 0;
            -webkit-box-shadow: inset 1px 1px 2px rgba(238, 238, 238, 0.2);
            box-shadow: inset 1px 1px 2px rgba(238, 238, 238, 0.2);
            font: normal 14px/14px Arial, Helvetica, sans-serif;
        }
        .smart-green textarea{
            height:100px;
            padding-top: 10px;
        }










        body, table {
            font-size: 13px;
        }
        table {
            table-layout: fixed;
            empty-cells: show;
            border-collapse: collapse;
            margin: 0 auto;
        }
        td {
            height: 40px;
        }
        h1, h2, h3 {
            font-size: 12px;
            margin: 0;
            padding: 0;
        }
        .table {

            border: 0px solid #cad9ea;
            color: #666;
        }
        .table th {
            background-repeat: repeat-x;
            height: 45px;
        }
        .table td, .table th {
            border: 0px solid #cad9ea;
            padding: 0 1em 0;
        }
        .table tr.alter {
            background-color: #f5fafe;
        }
        :root {
            --height: 100px;
            --width: 200px;
        }
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            width: 100%;
            height: 10px;
            background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 50%);
            font-family: sans-serif;
        }
        body, table1 {
            font-size: 12px;
        }
        table1 {
            table-layout: fixed;
            empty-cells: show;
            border-collapse: collapse;
            margin: 0 auto;
        }
        td {
            height: 40px;
        }
        h1, h2, h3 {
            font-size: 12px;
            margin: 0;
            padding: 0;
        }
        .table1 {

            border: 0px solid #cad9ea;
            color: #666;
        }
        .table1 th {
            background-repeat: repeat-x;
            height: 25px;
        }
        .table1 td, .table1 th {
            border: 0px solid #cad9ea;
            padding: 0 1em 0;
        }
        .table1 tr.alter {
            background-color: #f5fafe;
        }
        :root {
            --height: 100px;
            --width: 200px;
        }
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            width: 100%;
            height: 10px;
            background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 50%);
            font-family: sans-serif;
        }
        .demo{width:460px; margin:20px auto 0 auto; height:70px;}
        .button {
            display: inline-block;
            outline: none;
            cursor: pointer;
            text-align: center;
            text-decoration: none;
            font: 16px/100% 'Microsoft yahei',Arial, Helvetica, sans-serif;
            padding: .5em 4em .55em;
            text-shadow: 0 1px 1px rgba(0,0,0,.3);
            -webkit-border-radius: .5em;
            -moz-border-radius: .5em;
            border-radius: .5em;
            -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
            -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
            box-shadow: 0 1px 2px rgba(0,0,0,.2);
        }
        .button:hover {
            text-decoration: none;
        }
        .button:active {
            position: relative;
            top: 1px;
        }
        .bigrounded {
            -webkit-border-radius: 2em;
            -moz-border-radius: 2em;
            border-radius: 2em;
        }
        .medium {
            font-size: 20px;
            padding: .4em 1.5em .42em;
        }
        .small {
            font-size: 11px;
            padding: .2em 1em .275em;
        }
        /* blue */
        .blue {
            color: #d9eef7;
            border: solid 1px #0076a3;
            background: #0095cd;
            background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
            background: -moz-linear-gradient(top,  #00adee,  #0078a5);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
        }
        .blue:hover {
            background: #007ead;
            background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e));
            background: -moz-linear-gradient(top,  #0095cc,  #00678e);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc', endColorstr='#00678e');
        }
        .blue:active {
            color: #80bed6;
            background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
            background: -moz-linear-gradient(top,  #0078a5,  #00adee);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5', endColorstr='#00adee');
        }
        /* green */
        .green {
            color: #e8f0de;
            border: solid 1px #538312;
            background: #64991e;
            background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
            background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
        }
        .green:hover {
            background: #538018;
            background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
            background: -moz-linear-gradient(top,  #6b9d28,  #436b0c);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
        }
        .green:active {
            color: #a9c08c;
            background: -webkit-gradient(linear, left top, left bottom, from(#4e7d0e), to(#7db72f));
            background: -moz-linear-gradient(top,  #4e7d0e,  #7db72f);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
        }

        /* white */
        .white {
            color: #606060;
            border: solid 1px #b7b7b7;
            background: #fff;
            background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
            background: -moz-linear-gradient(top,  #fff,  #ededed);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
        }
        .white:hover {
            background: #ededed;
            background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
            background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
        }
        .white:active {
            color: #999;
            background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
            background: -moz-linear-gradient(top,  #ededed,  #fff);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
        }

        /* orange */
        .orange {
            color: #fef4e9;
            border: solid 1px #da7c0c;
            background: #f78d1d;
            background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
            background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
        }
        .orange:hover {
            background: #f47c20;
            background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
            background: -moz-linear-gradient(top,  #f88e11,  #f06015);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
        }
        .orange:active {
            color: #fcd3a5;
            background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
            background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
        }
        input {
            border: 1px solid #ccc;
            padding: 7px 0px;
            border-radius: 3px;
            padding-left: 5px;
            -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
            -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
            -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
            transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
        }
        input:focus {
            border-color: #66afe9;
            outline: 0;
            -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6)
        }

    </style>
</head>

<body>
<div class="topnav">
    <nav>
        <div class="nav_r">
            <a th:href="@{/myorder(userId=${userId})}">我的订单</a>
            <span class="liner">|</span>
            <!--            <a th:href="@{/tupdata(userId=${userId})}" class="myself">个人中心</a>-->
            <a href="update" class="myself">个人中心</a>
        </div>

    </nav>
    1
</div>
<header>

</header>
<main>
    <div class="show">
        <div class="top">
            <p>
            </p>
            <p>
            </p>
        </div>
        <form method="post" th:action="@{/ordermsgs}">
            <input type="hidden" name="bedType" th:value="${bedType}">
            <input type="hidden" name="hotelName" th:value="${hotelName}">
            <input type="hidden" name="orderId" th:value="${orderId}">
            <input type="hidden" name="roomName" th:value="${roomName}">
            <input type="hidden" name="time" th:value="${time}">
            <input type="hidden" name="ordernum" th:value="${ordernum}">
            <input type="hidden" name="userId" id="userId" th:value="${userId}">

            <table width="90%" class="table">
                <tr>
                    <th colspan="4"><h1>订单详情</h1></th>

                </tr>
                <tr class="alter">
                    <th></th>
                    <th>入住酒店:</th>
                    <th th:text="${hotalName}"></th>
                    <th></th>
                </tr>
                <tr class="alter">
                    <th></th>
                    <th>入住房间:</th>
                    <th th:text="${roomName}"></th>
                    <th></th>
                </tr>
                <tr class="alter">
                    <th></th>
                    <th>房间类型:</th>
                    <th th:text="${bedType}"></th>
                    <th></th>
                </tr>
                <tr class="alter">
                    <th></th>
                    <th>下单时间:</th>
                    <th th:text="${time}"></th>
                    <th></th>
                </tr>
                <tr class="alter">
                    <th></th>
                    <th>订单编号:</th>
                    <th th:text="${ordernum}"></th>
                    <th></th>
                </tr>
                <tr>
                    <th></th>
                    <th></th>
                    <th></th>
                    <th></th>
                </tr>
                <tr><th></th><span th:unless="${message}">
                    <th  class="smart-green" colspan="2" rowspan="4"><textarea name="message"></textarea> </th>
                    </span>
                    <span th:if="${message}">
                    <th  class="smart-green" colspan="2" rowspan="4"><textarea name="message" th:text="${message}"></textarea> </th>
                    </span>
                <th></th>
                </tr><tr></tr><tr></tr><tr></tr><tr></tr>
                <tr>
                    <th></th>
                    <th colspan="2">
                        <span th:unless="${message}">
                            <button class="button green" type="submit" >提交评论</button>
                        </span>

                    </th>
                    <th></th>
                </tr>
                <tr id="my_state" th:fragment="my_state">
                    <th th:colspan="4" >
                        <a   class="button orange"  th:href="@{/myorder(userId=${userId})}">订单</a>&nbsp;&nbsp;
                        <a class="button blue"  th:href="@{/toMain(userId=${userId})}">主页</a>

                    </th>
                </tr>
            </table>
            <table width="90%" class="table1">
                <tr><th colspan="5"></th></tr><tr><th colspan="5"></th></tr><tr><th colspan="5"></th></tr>
                <tr><th colspan="5"></th></tr><tr><th colspan="5"></th></tr><tr><th colspan="5"></th></tr>
                <tr><th colspan="5"></th></tr><tr><th colspan="5"></th></tr>
            </table>
        </form>

    </div>
    <footer>
        <div class="promise">
        </div>
        <div class="full">
            <ul>
                <li></li>
                <li>100%正品保证</li>
                <li></li>
                <li>快速配送服务</li>
                <li></li>
                <li>运费满额减免</li>
                <li></li>
                <li>7天退换货无忧</li>
                <li></li>
                <li>保税仓直发</li>
            </ul>
        </div>
        <div class="last">
            <div class="last_l">
                <p>
                    <span>在线搜索</span>
                    <span class="liner">|</span>
                    <span>快捷支付</span>
                </p>
                <p>
                    <a href="http://jira2.suncaper.net/projects/TEAM16/issues/TEAM16-62?filter=allopenissues">关于我们</a>
                    <span class="liner">|</span>
                    <a href="http://jira2.suncaper.net/projects/TEAM16/issues/TEAM16-62?filter=allopenissues">加入</a>

                </p>
                <p>© Team16 酒店辅助订购系统
                </p>
            </div>

        </div>
    </footer>
</main>
<div class="well">




</div>
<script th:src="@{/assets/js/state_change.js}"></script>
<script th:src="@{/assets/js/jquery.js}"></script>
<script th:src="@{/assets/js/jquery.filterizr.min.js}"></script>
<script  src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
<script  src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
<script th:src="@{/assets/js/jquery-ui.min.js}"></script>
<script th:src="@{/assets/js/jquery.counterup.min.js}"></script>
<script th:src="@{/assets/js/jquery.sticky.js}"></script>
</body>


</html>
